<template>
    <div class="flex center">
        <!-- 父类视图及操作 -->
        <div class="flex">
            <p class="bv-hint">{{ `父类数据: text = ${text} / numberText = ${numberText}` }}</p>
        </div>
    </div>
</template>
<script>
    import { ref, reactive, onMounted, watch } from "vue";
    export default {
        components: {},
        setup (props, context) {
            const text = ref(0);
            const numberText = ref('');

            const form = reactive({
                text: 0,
                numberText: '',
            });

            watch(() => text, (val) => {

            })

            onMounted(() => {
                text.value = 0;
                numberText.value = 0;
            })

            const onClick = () => {
                context.emit('click', {});
            }

            return {
                text,
                numberText,
            }
        },
    }
</script>
<style scoped>
    .bv-hint {
        font-size: 16px;
        color: #333333;
        font-weight: bold;
    }
    .def-view {
        width: 130px;
        font-size: 22px;
        color: #409EFF;
        font-weight: bold;
    }
</style>